<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<title>用户管理</title>
<%@include file="/jsp/common/inc.jsp" %>
<script type="text/javascript">
	var grid;
	$(function() {
		grid = $("#datagrid").datagrid({
			url : "${pageContext.request.contextPath}/userController/datagrid",
			striped : true,
			rownumbers : true,
			pagination : true,
			singleSelect : true,
			fitColumns : true,
			idField : "id",
			pagesize : 10,
			pageList : [ 10, 20, 30 ],
			toolbar : "#toolbar",
			columns : [ [ {
				width : 100,
				title : "登录名",
				field : "username"
			},{
				width : 100,
				title : "姓名",
				field : "realname"
			},{
				width : 100,
				title : "手机",
				field : "mobilePhone"
			},{
				width : 100,
				title : "邮箱",
				field : "email"
			},{
				width : 100,
				title : "状态",
				field : "status",
				formatter : function(value,rowData,rowIndex){
					switch(value){
					case "0":
						return "正常";
					case "1":
						return "注销";
					}
				}
			},{
				width : 100,
				title : "操作",
				field : "action",
				formatter : function(value,rowData,rowIndex){
					var str = "<button onclick='showFun(" + rowIndex + ")'>查看</buttion>";
					str +=  "<button onclick='editFun(" + rowIndex + ")'>编辑</buttion>";
					str +=  "<button onclick='showGrantFun(" + rowIndex + ")'>授权</buttion>";
					str +=  "<button onclick='deleteFun(" + rowIndex + ")'>删除</buttion>";
					return str;
				}
			}] ]
		});
	});

	// 查询用户数据列表
	function searchFun() {
		datagrid.datagrid("load", sy.serializeObject($("#searchForm")));
	}

	//清空查询条件
	function clearFun() {
		$("#searchForm").find("input").val("");
		datagrid.datagrid("load", {});
	}
	
	//增加用户
	var addFun = function(){
		var dialog = parent.sy.modalDialog({
			title : "增加角色",
			url : "${pageContext.request.contextPath}/userController/add",
			buttons : [{
				text : "添加",
				handler : function(){
					dialog.find('iframe').get(0).contentWindow.submitForm(dialog, grid, parent.$);
				}
			}]
		})
	};
	// 显示授权弹出框
	function showGrantFun(rowIndex){
		$("#WinUserRole").window("open");
		var row = $("#datagrid").datagrid("getRows")[rowIndex];
		$("#userId").val(row.id);
		$("#uName").val(row.username);
		$("#tree").tree({
			fit : true,
			checkbox : true,
			url : "<%=request.getContextPath()%>/userController/getUserRoles",
			queryParams:{userId:row.id},
		});
	}
	
	// 保存用户角色信息
	function saveUserRoles(){
		var userId = $("#userId").val();
		// 获取选中的节点的id
		var nodes = $("#tree").tree("getChecked");
		var roleIds = "";
		for(var i = 0; i < nodes.length; i++){
			if(roleIds != ""){
				roleIds+= ",";
			}
			roleIds += nodes[i].id;
		}
		$.post("${pageContext.request.contextPath}/userController/addUserRole",{"userId":userId,"roleIds":roleIds},
				function(result){
			if(result.success){
				$.messager.alert('提示','分配资源成功！','info');
			}else{
				$.messager.alert('提示', result.msg, 'error');
			}
		});
		$('#WinUserRole').window('close');
		$('#datagrid').datagrid('reload');
	}
	
</script>
</head>
<body class="easyui-layout" data-options="fit:true,border:false">
	<div id="toolbar" style="display: none;">
		<table>
			<tr>
				<td>
					<form id="searchForm">
						<table>
							<tr>
								<td>登录名</td>
								<td><input name="username" style="width: 80px;" /></td>
								<td>姓名</td>
								<td><input name="realName" style="width: 80px;" /></td>
								<td><a href="#" class="easyui-linkbutton" onclick="searchFun()">查询</a> <a href="#" class="easyui-linkbutton" onclick="clearFun()">清空</a></td>
							</tr>
						</table>
					</form>
				</td>
			</tr>
			<tr>
				<td>
					<table>
						<tr>
							<td><a href="#" class="easyui-linkbutton" onclick="addFun();">添加</a></td>
							<td>
								<div class="datagrid-btn-separator"></div>
							</td>
						</tr>
					</table>
				</td>
			</tr>
		</table>
	</div>
	<div data-options="region:'center',fit:true,border:false">
		<table id="datagrid" data-options="fit:true,border:false"></table>
	</div>
	
	<!--  分配角色弹出框 -->
	<div id="WinUserRole" class="easyui-window" title="分配角色"
		data-options="modal:true,closed:true,iconCls:'icon-save'"style="width:400px;height:300px;padding:10px;">
		<div class="easyui-layout" data-options="fit:true">
			<div data-options="region:'center',title:''">
				<form id="RoleUserfrom" method="post">
					<input id="userId" type="hidden" name="id" >
					<table id="TreeTable">
					<tr>
						<td>
				     用户账号:<input id="uName" class="easyui-validatebox" type="text" readonly="readonly" >
				     	<a href="javascript:void(0)" style="color: red">用户账号不可编辑</a>
						</td>
					</tr>
	
					</table>
                <ul id="tree" class="easyui-tree" ></ul>
				</form>
			</div>
			
			<div data-options="region:'south',border:false" style="height:50px">
				<div style="text-align:right;padding:5px;" >
					<a href="javascript:void(0)" data-options="iconCls:'icon-ok'"
						class="easyui-linkbutton" onclick="saveUserRoles()">保存</a> <a
						href="javascript:void(0)" data-options="iconCls:'icon-cancel'"
						class="easyui-linkbutton" onclick="$('#WinUserRole').window('close')">关闭</a>
				</div>
			</div>
		</div>
	</div>
	
</body>
</html>